﻿<controls:VNetUserControl x:Class="VNet.VisiSuite.Controls.ToolbarControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:controls="clr-namespace:VNet.VisiSuite.Controls"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    
    <Border HorizontalAlignment="Stretch" VerticalAlignment="Stretch" x:Name="_toolbar" Background="Black" BorderThickness="0">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="30" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="50" />
            </Grid.RowDefinitions>
            <Border Grid.Column="0" Background="Black" VerticalAlignment="Stretch" Height="50">
                <Label Content="{Binding Title, Mode=OneWay}" HorizontalContentAlignment="Center" Foreground="White" FontSize="10pt">
                    <Label.LayoutTransform>
                        <TransformGroup>
                            <RotateTransform Angle="-90" />
                        </TransformGroup>
                    </Label.LayoutTransform>
                </Label>
            </Border>
            <Border Grid.Column="0" Grid.ColumnSpan="2" Margin="25 0 0 0" Padding="0" x:Name="_panel" Background="Black" HorizontalAlignment="Stretch" VerticalAlignment="Top" Height="50">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"></ColumnDefinition>
                        <ColumnDefinition Width="*"></ColumnDefinition>
                        <ColumnDefinition Width="Auto"></ColumnDefinition>
                    </Grid.ColumnDefinitions>
                    <ListView Grid.Column="0" x:Name="_left_tiles" Background="Black" BorderBrush="Transparent" BorderThickness="0" Width="Auto" Height="50" Margin="14,0,0,0" Padding="0" Focusable="False" HorizontalAlignment="Left"
                        HorizontalContentAlignment="Left" SelectionChanged="onSelectionChanged" PreviewMouseLeftButtonUp="onLeftMouseUp" PreviewTouchUp="onLeftMouseUp" >
                        <ListView.Resources>
                            <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Transparent" />
                            <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="Black" />
                            <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="Transparent" />
                        </ListView.Resources>
                        <ListView.ItemsPanel>
                            <ItemsPanelTemplate>
                                <WrapPanel Width="{Binding (FrameworkElement.ActualWidth), 
                                    RelativeSource={RelativeSource AncestorType=ScrollContentPresenter}}" ItemWidth="{Binding (ListView.View).ItemWidth, RelativeSource={RelativeSource AncestorType=ListView}}" ItemHeight="{Binding (ListView.View).ItemHeight, 
                                    RelativeSource={RelativeSource AncestorType=ListView}}" />
                            </ItemsPanelTemplate>
                        </ListView.ItemsPanel>
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <Border x:Name="border1" BorderThickness="2" BorderBrush="{Binding Background}" Background="{Binding Background}" Margin="0,0,12,0" Tag="{Binding Foreground}" Opacity="{Binding Opacity}">
                                    <Grid x:Name="grid1" Margin="0,0,0,0" Width="120" Height="38" Background="{Binding Background}" VerticalAlignment="Center">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="*" />
                                        </Grid.ColumnDefinitions>
                                        <TextBlock Grid.Column="0" Foreground="{Binding Foreground}" FontFamily="Segoe UI" FontSize="12pt" Text="{Binding Path=Title}" VerticalAlignment="Center" HorizontalAlignment="Center"  TextWrapping="Wrap" TextAlignment="Center" />
                                    </Grid>
                                </Border>
                                <DataTemplate.Triggers>
                                    <MultiDataTrigger>
                                        <MultiDataTrigger.Conditions>
                                            <Condition Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ListViewItem}}, Path=IsMouseOver}" Value="True" />
                                            <Condition Binding="{Binding IsEnabled}" Value="True" />
                                        </MultiDataTrigger.Conditions>
                                        <Setter Property="Background" TargetName="grid1" Value="Black" />
                                        <Setter Property="Background" TargetName="border1" Value="Black" />
                                    </MultiDataTrigger>
                                </DataTemplate.Triggers>
                            </DataTemplate>
                        </ListView.ItemTemplate>
                        <ListView.ItemContainerStyle>
                            <Style TargetType="{x:Type ListViewItem}">
                                <Setter Property="Height" Value="48" />
                                <Setter Property="Background" Value="Black" />
                                <Setter Property="Focusable" Value="True" />
                                <Setter Property="Foreground" Value="Pink" />
                                <Setter Property="BorderBrush" Value="Pink" />
                                <Setter Property="BorderThickness" Value="0" />
                                <Setter Property="Margin" Value="0" />
                                <Setter Property="Padding" Value="0" />
                            </Style>
                        </ListView.ItemContainerStyle>
                    </ListView>

                    <ListView Grid.Column="2" x:Name="_right_tiles" Background="Black" BorderBrush="Transparent" BorderThickness="0" Width="Auto" Height="50" Margin="0,0,12,0" Focusable="False" HorizontalAlignment="Left"
                        HorizontalContentAlignment="Left" SelectionChanged="onSelectionChanged" PreviewMouseLeftButtonUp="onLeftMouseUp" PreviewTouchUp="onLeftMouseUp" >
                        <ListView.Resources>
                            <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Transparent" />
                            <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="Black" />
                            <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="Transparent" />
                        </ListView.Resources>
                        <ListView.ItemsPanel>
                            <ItemsPanelTemplate>
                                <WrapPanel Width="{Binding (FrameworkElement.ActualWidth), 
                                    RelativeSource={RelativeSource AncestorType=ScrollContentPresenter}}" ItemWidth="{Binding (ListView.View).ItemWidth, RelativeSource={RelativeSource AncestorType=ListView}}" ItemHeight="{Binding (ListView.View).ItemHeight, 
                                    RelativeSource={RelativeSource AncestorType=ListView}}" />
                            </ItemsPanelTemplate>
                        </ListView.ItemsPanel>
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <Border x:Name="border1" BorderThickness="2" BorderBrush="{Binding Background}" Background="{Binding Background}" Margin="12,0,0,0" Tag="{Binding Foreground}" Opacity="{Binding Opacity}" >
                                    <Grid x:Name="grid1" Margin="0,0,0,0" Width="120" Height="38" Background="{Binding Background}" VerticalAlignment="Center">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="*" />
                                        </Grid.ColumnDefinitions>
                                        <TextBlock Grid.Column="0" Foreground="{Binding Foreground}" FontFamily="Segoe UI" FontSize="12pt" Text="{Binding Path=Title}" VerticalAlignment="Center" HorizontalAlignment="Center" TextWrapping="Wrap" TextAlignment="Center" />
                                    </Grid>
                                </Border>
                                <DataTemplate.Triggers>
                                        <MultiDataTrigger>
                                            <MultiDataTrigger.Conditions>
                                                <Condition Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ListViewItem}}, Path=IsMouseOver}" Value="True" />
                                                <Condition Binding="{Binding IsEnabled}" Value="True" />
                                            </MultiDataTrigger.Conditions>
                                            <Setter Property="Background" TargetName="grid1" Value="Black" />
                                            <Setter Property="Background" TargetName="border1" Value="Black" />
                                        </MultiDataTrigger>
                                </DataTemplate.Triggers>
                            </DataTemplate>
                        </ListView.ItemTemplate>
                        <ListView.ItemContainerStyle>
                            <Style TargetType="{x:Type ListViewItem}">
                                <Setter Property="Height" Value="48" />
                                <Setter Property="Background" Value="Black" />
                                <Setter Property="Focusable" Value="True" />
                                <Setter Property="Foreground" Value="Pink" />
                                <Setter Property="BorderBrush" Value="Pink" />
                                <Setter Property="BorderThickness" Value="0" />
                                <Setter Property="Margin" Value="0" />
                                <Setter Property="Padding" Value="0" />
                            </Style>
                        </ListView.ItemContainerStyle>
                    </ListView>

                </Grid>
            </Border>
            
        </Grid>
    </Border>
</controls:VNetUserControl>
